<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="UTF-8">
    <title>人员分配</title>
    <link rel="stylesheet" href="../style/bootstrap.min.css"/>
    <script type="text/javascript" src="../scripts/jquery.js"></script>
    <script type="text/javascript" src="../scripts/bootstrap.min.js"></script>
    <!--全选与取消全选-->
    <script>
        function selectChange() {
            var chkSelectAll = document.getElementById("checkAll");
            var checked = chkSelectAll.checked;
            if (checked) {
                // select all products
                selectAllItem();
            } else {
                //unselect all products
                unSelectAll();
            }
        }

        //选择全部
        function selectAllItem() {
            var items = document.getElementsByName("FpId");
            for (var i = 0; i < items.length; i++) {
                items[i].checked = true;
            }
        }

        //取消全选
        function unSelectAll() {
            var items = document.getElementsByName("FpId");
            for (var i = 0; i < items.length; i++) {
                items[i].checked = false;
            }
        }

    </script>

    <!--人员分配模态框-->
    <script>
        function buttonFP() {
            var fp = document.getElementsByName("FpId");
            for (var i = 0; i < fp.length; i++) {
                if (fp[i].checked) {
                    var fp2 = document.getElementsByName("shen" + fp[i].value);
                    for (var j = 0; j < fp2.length; j++) {
                        if (fp2[j].checked) {
                            if (fp2[j].value=='1'){
                                document.getElementById("lord").value = fp[i].value;
                                document.getElementById("zs1").innerHTML = $("#name" + fp[i].value).text();
                                document.getElementById("zsR1").innerHTML = $("#role" + fp[i].value).text();
                            } else if (fp2[j].value=='2'){

                                document.getElementById("adjudication").value = fp[i].value;
                                document.getElementById("zs2").innerHTML = $("#name" + fp[i].value).text();
                                document.getElementById("zsR2").innerHTML = $("#role" + fp[i].value).text();
                            }
                        }
                    }

                }
            }
        }
    </script>
</head>

<body>
<div class="container">
    <!--
    <div class="row">
        <form action="" method="post">
            <h3 class="col-xs-12 text-right">
                项目批次时间：<input type="text">至<input type="text">
                <input class="btn-primary" type="button" value="查询"/>
            </h3>
        </form>
    </div>
    -->
    <form action="/Projects/fpItem">
        <input type="hidden" th:value="${p.id}" name="id">
        <div>
            <h3 th:if="${p.phase == 1}">非现场阶段</h3>
            <h3 th:if="${p.phase == 2}">现场阶段</h3>
            <h3 th:if="${p.phase == 0}">全部阶段</h3>
            <div style="height: 280px;">
                <table class="table-bordered table table-striped table-hover table-condensed">
                    <tr>
                        <th>项目名称</th>
                        <th>审计单位</th>
                        <th>主审</th>
                        <th>主审角色</th>
                        <th>助审</th>
                        <th>助审角色</th>
                    </tr>
                    <tr data-toggle="modal" data-target="#insert">
                        <td th:text="${p.name}">项目名称</td>
                        <td th:text="${p.institutions}">审计单位</td>
                        <td><span id="zs1">无</span>
                            <input type="hidden" id="lord" name="lord">
                        </td>
                        <td><span id="zsR1">无</span>
                        <td><span id="zs2">无</span>
                            <input type="hidden" id="adjudication" name="adjudication">
                        </td>
                        <td><span id="zsR2">无</span></td>
                    </tr>
                </table>
            </div>
        </div>
        <div>

            <input type="submit" value="下一步"/>

        </div>
    </form>
    <!--项目分配的模态框-->
    <div class="modal fade" id="insert">
        <div class="modal-dialog">
            <div class="modal-content" style="width: 450px;">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal">×</button>
                    <h4>人员分配</h4>
                </div>
                <form action="">
                    <div class="media-body container">
                        <table class="unit-the-table table">
                            <tr>
                                <th><input id="checkAll" type="checkbox" onclick="selectChange()"/></th>
                                <th>人员</th>
                                <th>角色</th>
                                <th>人员资质</th>
                            </tr>
                            <tr th:each="users:${u}">
                                <td><input name="FpId" type="checkbox" th:value="${users.user.id}"/></td>
                                <td th:text="${users.user.name}"
                                    th:id="'name'+${users.user.id}">张三三</td>
                                <td><span><input type="radio" th:name="'shen'+${users.user.id}" value="1">主审</span>
                                    <span><input type="radio" th:name="'shen'+${users.user.id}" value="2">助审</span>
                                </td>
                                <td><span th:text="${users.user.userAptitude}"
                                          th:id="'role'+${users.user.id}" ></span></td>
                            </tr>
                        </table>
                    </div>
                    <div class="modal-footer">
                        <input type="button" class="btn btn-info btn-block" value="保存"
                               onclick="buttonFP()" data-dismiss="modal"/>
                        <input type="reset" class="btn btn-warning btn-block" value="重置"/>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!--结束-->
</div>
</body>

</html>